/*
* @Author: yanyanru
* @Date: 2018/4/12
* @description: 管理公司
*/
<template>
    <div class='custom-box m-t-20 p-20'>
        <div class="custom-title">
            <h3>管理公司</h3>
            <div class="pull-left m-l-20">
                <button type="button"
                @click='addManageCompany'
                class="custom-btn custom-btn-round"><i class="fa fa-plus"></i></button>
            </div>
        </div>
          <el-table
            stripe
            :data="pageList"
            style="width:100%"
            class="m-t-20">
            <el-table-column
                prop="id"
                align="center"
                label="ID">
            </el-table-column>
            <el-table-column
                prop="managerType"
                align="center"
                label="管理公司类型">
                <template slot-scope="scope">
                    <span v-if="scope.row.managerType == 4">LP</span>
                    <span v-if="scope.row.managerType == 2">GP</span>    
                    <!-- {{scope.row.managerType | getNameById('companyIdentity')}} -->
                </template>
            </el-table-column>
            <el-table-column
                prop="companyName"
                align="center"
                label="企业名称">
            </el-table-column>
            <el-table-column
                prop="createTime"
                align="center"
                label="创建时间">
                <template slot-scope="scope">
                    {{scope.row.createTime | cmsMoment}}
                </template>
            </el-table-column>
            <el-table-column prop="modifyTime" align="center" label="更新时间">
                <template slot-scope="scope">
                    {{scope.row.modifyTime | cmsMoment}}
                </template>
            </el-table-column>
            <el-table-column align="center" label="操作">
                <template slot-scope="scope">
                    <el-button type="text" @click="goEdit(scope.row)">编辑</el-button>
                    <el-button type="text" v-if="scope.row.status !== 1" @click="related(scope.row)">关联</el-button>
                    <el-button type="text" v-else  @click="related(scope.row)">取消关联</el-button>            
                    <el-button type="text" @click="goDel(scope.row.id)">删除</el-button>
                </template>
            </el-table-column>
        </el-table>
        <div class="m-t-20 m-b-20">
            <el-pagination
                small
                @current-change="handleCurrentChange"
                :current-page="listPageIndex"
                :total="listTotalCount" :page-size="listPageSize" layout="prev, pager, next">
            </el-pagination>
        </div>
        <!--添加弹出层-->
        <el-dialog title="管理公司" :visible.sync="dialogFormVisible">
            <el-form class="p-b-100">
                <el-col :span="12">
                    <el-form-item label="管理公司" labelWidth="150px">
                        <el-input
                            placeholder="搜索选择后在此显示"
                            v-model='companyOpenSearch.name'
                            style="width:100%"
                            @keyup.enter.native="searchFundInfoEvent"
                            @change="changeId"
                        ></el-input>
                    </el-form-item>
                </el-col>
                <el-col :span="5" class="m-l-10">
                    <el-select  v-model="companyOpenSearch.attribute" placeholder="请选择" style="width:100%;margin-top:3px" @change="cleanCompany">
                        <el-option
                            v-for="item in options"
                            :key="item.dictValue"
                            :label="item.dictName"
                            :value="item.dictValue-0">
                        </el-option>
                    </el-select>
                </el-col>
                <el-col :span="3" class="m-l-10">
                    <el-button type="primary" style="width:100px;margin-top:3px" @click="searchFundInfoEvent()">搜索</el-button>
                </el-col>
            </el-form>
        </el-dialog>
        <!--搜索管理公司弹出框-->
        <el-dialog :visible.sync="searchFlag" :show-close=false>
            <el-table :data="searchList" stripe style="width:100%" @cell-click="selectCompany"
                        v-loading="loading2" element-loading-text="Loading">
                <el-table-column prop="id" label="ID">
                </el-table-column>
                <el-table-column prop="fullName" label="企业名称（机构）">
                </el-table-column>
                <el-table-column prop="intFullName" label="国际化名称">
                </el-table-column>
            </el-table>
            <div class="m-t-20 m-b-20">
                <el-pagination
                    small
                    @current-change="handleCurrentChangeManageCompany"
                    :current-page="searchPageIndex"
                    :total="searchTotalCount" :page-size="searchPageSize"
                    layout="prev, pager, next">
                </el-pagination>
            </div>
        </el-dialog>
    </div>
</template>
<script lang="ts">
import Vue from 'vue';
import { Component, Watch, Prop } from 'vue-property-decorator';
import { CompanySearch, } from '../../../../../service/common/interface';
import CommonService from '../../../../../service/common/index';
import { CompanyOpenSearchVO, ComFundFirmDto  } from '../../../../../api/Interface';
import ComFundService from '../../../../../service/subject/company/fund-info/index';
import { CompanyOtherInfoSearchDto, } from '../../../../../service/subject/company/companyInterface';
@Component({
  components: { }
})
export default class BasicInfo extends Vue {
    @Prop({})
    public fundId: number;
    // 初始化数据 相当于data
    public companyOtherInfoSearch: CompanyOtherInfoSearchDto = {} as CompanyOtherInfoSearchDto;
    public comFundFirm: ComFundFirmDto = {} as ComFundFirmDto; // model
    public pageList: object[] = []; // 列表页list
    public listPageIndex: number = 1; // 列表页index
    public listPageSize: number = 10; // 列表页pageSize
    public listTotalCount: number = 111; //列表页总条数
    public searchList: object[] = []; // 搜索页List
    public searchPageIndex: number = 1; // 搜索页index
    public searchPageSize: number = 10; // 搜索页pageSize
    public searchTotalCount: number = 111; //搜索页总条数
    public companyOpenSearch: CompanySearch = {} as CompanySearch; // 搜索
    public dialogFormVisible: boolean = false;
    public searchFlag: boolean = false;
    public loading2: boolean = false;
    public options: object[] = [
        {
            dictName: 'LP',
            dictValue: 4,
        },
        {
            dictName: 'GP',
            dictValue: 2,
        },
    ];
    // refs
    public $refs: { };

    // watch
    @Watch('msg')
    public onChildChanged(val: string, oldVal: string) {
        return val + '***';
    }

    // 声明周期钩子
    // public mounted() {
    // }
    public created() {
        this.getCompanyListEvent(); // 管理公司列表
    }
    // 方法
     // 获取管理公司列表
    public async getCompanyListEvent() {
        this.companyOtherInfoSearch['pageParam.pageIndex'] = this.listPageIndex;
        this.companyOtherInfoSearch['pageParam.pageSize'] = this.listPageSize;
        this.companyOtherInfoSearch.companyId = Number(this.$route.params.itemId);
        const res = await ComFundService.getFundCompanyList(this.companyOtherInfoSearch);
        if (res.resCode === '0') {
            this.listTotalCount = res.data.totalCount;
            this.pageList = res.data.resultData;
        }
    }
    // 搜索列表
    public async searchFundInfoEvent() {
        this.searchFlag = true;
        this.loading2 = true;
        this.companyOpenSearch['pageParam.pageIndex'] = this.searchPageIndex;
        this.companyOpenSearch['pageParam.pageSize'] = this.searchPageSize;
        this.companyOpenSearch.searchType = 'full_name'; // 默认中文名搜索
        const res = await CommonService.getCompanySearch(this.companyOpenSearch);
        if (res.resCode === '0') {
            this.loading2 = false;
            this.searchList = res.data.resultData;
            this.searchTotalCount = res.data.totalCount;
        }
    }
    // 点击加号初始化
    public addManageCompany() {
        this.dialogFormVisible = true;
        this.companyOpenSearch = {} as CompanySearch;
        this.$set(this.companyOpenSearch, 'attribute', 4);
        // this.companyOpenSearch.attribute = 4;
    }
    public changeId(val: string) {
        // this.msg = 4446;
    }
    // 切换时 清空 company
    public cleanCompany() {
     this.companyOpenSearch.name = '';
    }
    // 选择一个公司 添加一条记录
    public selectCompany(row: CompanyOpenSearchVO) {
        this.companyOpenSearch.name = row.fullName;
        this.searchFlag = false;
        // comFundFirm赋值
        this.comFundFirm.companyId = Number(this.$route.params.itemId); // 工商id
        this.comFundFirm.fundId = this.fundId; // 基金id
        this.comFundFirm.managerCompanyId = row.id; // 管理公司关联的工商id?????
        // this.comFundFirm.managerId = row.id; // 企业id???????????????????/
        this.comFundFirm.managerType = this.companyOpenSearch.attribute;
        this.comFundFirm.status = 1; //关联
        this.saveCompany();
    }
    public async saveCompany() {
        if (this.comFundFirm.id) { // 修改
            this.update();
        } else { // 添加
            this.save();
        }
    }
    // 保存
    public async save() {
        const { resCode } = await ComFundService.saveCompany(this.comFundFirm);
        if (resCode === '0') {
            this.$message.success('添加成功');
            this.searchFlag = false;
            this.dialogFormVisible = false;
            this.getCompanyListEvent();
        }
    }
    // 修改
    public async update() {
        const { resCode } = await ComFundService.updateCompany(this.comFundFirm);
        if (resCode === '0') {
            this.$message.success('修改成功');
            this.searchFlag = false;
            this.dialogFormVisible = false;
            this.getCompanyListEvent();
        }
    }
    public handleCurrentChangeManageCompany(val: number) {
        this.searchPageIndex = val;
        this.searchFundInfoEvent();

    }
    public handleCurrentChange(val: number) {
        this.listPageIndex = val;
        this.getCompanyListEvent();
    }  
    public goDel(id: number) {
        this.$confirm('是否删除此条信息, 是否继续?', '提示', {
            confirmButtonText: '确定',
            cancelButtonText: '取消',
            type: 'warning'
        }).then(() => {
            this.deleteCom(id);
        }).catch(() => {
            this.$message({
            type: 'info',
            message: '已取消删除'
            });          
        }); 
    } 
    public async deleteCom(id: number) {
        const { resCode } = await ComFundService.deleteCompany(id);
        if (resCode === '0') {
            this.$message.success('删除成功！');
            this.getCompanyListEvent();
        }
    }
    // 关联
    public related(row: any) {
        let message: string = '';
        let  status: number = 1;
        if (row.status === 1) {  //有关联关系 需要解除关联
            message = '确定取消关联？';
            status = 2;
        } else { // 没有关联关系 需要关联
            message = '确定信息关联？';
            status = 1;
        }
        this.$confirm(message, '提示', {
            confirmButtonText: '是',
            cancelButtonText: '否',
            type: 'warning'
        }).then(() => {
            this.comFundFirm = row;
             this.comFundFirm.status = status;
            this.update();
        });
    }
    // 编辑
    public goEdit(row: any) {
        this.comFundFirm.id = row.id;
        // this.$nextTick(() => {
            this.companyOpenSearch.name = row.companyName;
            this.$set(this.companyOpenSearch, 'attribute', row.managerType);
            // this.companyOpenSearch.attribute = row.managerType;
        // })
        this.dialogFormVisible = true;
    }
}
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped lang='scss'>
.p-b-100{
    padding-bottom: 100px;
}
</style>